<!DOCTYPE html>
<html lang="en">
	<head>
		<title>Charts - Imperio Admin</title>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />


		<link rel="stylesheet" type="text/css" href="css/bootstrap/bootstrap.min.css" />
		<link rel="stylesheet" type="text/css" href="css/bootstrap/bootstrap-responsive.min.css" />
		<link href="css/bootstrap/font-awesome.css" rel="stylesheet" type="text/css" />
		<link rel="stylesheet" type="text/css" href="css/home/imperio.css" />
		<link href="css/bootstrap/open-sans.css" rel="stylesheet" type="text/css" />
		
		<!--[if IE 7]>
    		<link rel="stylesheet" href="css/bootstrap/font-awesome-ie7.css">
    	<![endif]-->

        <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
        	<script src="js/util/html5.js"></script>
    	<![endif]-->
        
	</head>
    <body>
        <div class="container-fluid nopadding">
            <div class="row-fluid">
                <div class="span12">
                    <div id="header">
                        <a href="#">
							<img src="img/logo.png" alt="" />
						</a>
						<div class="hright">
							<div id="search" class="column">
								<div class="search">
									<form method="post" action="#">
										<input type="text" placeholder="Search here" value="Search here" name="keyword" id="keyword"> 
									</form>
								</div>
							</div>
							<div id="userinfo" class="column">
								<a class="userinfo dropown-toggle" data-toggle="dropdown" href="#userinfo">
									<img alt="" src="img/avatar.jpg" />
									<span><strong>Admin</strong></span>
								</a>
									<ul class="dropdown-menu">
										<li><a href="#">Edit Profile</a></li>
										<li><a href="#">Edit Preferences</a></li>
										<li><a href="#">Private Messages</a></li>
										<li class="divider"></li>
										<li><a href="login.html">Logout</a></li>
									</ul>
							</div>
						</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="container-fluid" id="container">
            <div class="row-fluid">
                <div class="span3 leftmenu">
                    <ul>
                        <li><a href="index.html"><span class="ico"><i class="icon-home"></i></span><span class="text">Dashboard</span></a></li>
                        <li><a href="forms.html"><span class="ico"><i class="icon-edit"></i></span><span class="text">Forms</span></a></li>
                        <li><a href="typography.html"><span class="ico"><i class="icon-bold"></i></span><span class="text">Typography</span></a></li>
                        <li><a href="tables.html"><span class="ico"><i class="icon-th-list"></i></span><span class="text">Tables</span></a></li>
                        <li class="active"><a href="charts.html"><span class="ico"><i class="icon-signal"></i></span><span class="text">Charts</span></a></li>
                        <li><a href="components.html"><span class="ico"><i class="icon-inbox"></i></span><span class="text">Components</span></a></li>
                        <li><a href="interface-elements.html"><span class="ico"><i class="icon-tasks"></i></span><span class="text">Interface elements</span></a></li>              
                        <li><a href="grid.html"><span class="ico"><i class="icon-th"></i></span><span class="text">Grid</span></a></li>
                        <li><a href="calendar.html"><span class="ico"><i class="icon-calendar"></i></span><span class="text">Calendar</span></a></li>
                        <li>
                            <a href="#"><span class="ico"><i class="icon-align-justify"></i></span><span class="text">Submenu test</span><span class="indicator"></span></a>
                            <ul>
                                <li><a href=""><span class="ico"><i class="icon-tint"></i></span><span class="text">Submenu One</span></a></li>
                                <li><a href=""><span class="ico"><i class="icon-leaf"></i></span><span class="text">Submenu Two</span></a></li>
                                <li><a href=""><span class="ico"><i class="icon-fire"></i></span><span class="text">Submenu Three</span></a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
                <div class="span9" id="content">
                    <div class="row-fluid">
                        <div class="span8">
                            <div class="box">
                                <div class="box-title">
                                    Line Chart
                                </div>
                                <div class="box-content">
                                    <div id="line-chart" style="height: 200px;"></div>
                                </div>
                            </div>
                        </div>
                        <div class="span4">
                            <div class="box alternate">
                                <div class="box-title">
                                    Pie Chart
                                </div>
                                <div class="box-content">
                                    <div id="pie-chart" style="height: 200px;"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row-fluid">
                        <div class="span12">
                            <div class="box">
                                <div class="box-title">
                                    Bar Chart
                                </div>
                                <div class="box-content">
                                    <div id="bar-chart" style="height: 300px;"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row-fluid">
                        <div class="span12">
                            <div class="box">
                                <div class="box-title">
                                    Real Time Chart
                                </div>
                                <div class="box-content">
                                    <div id="realtime-chart" style="height: 300px;"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            
            </div>       
        </div>  
    
    
        <script type="text/javascript" src="js/jquery.min.js"></script>
		<script type="text/javascript" src="js/bootstrap/bootstrap.min.js"></script>
        <!-- Explorer canvas, for IE6-8 support of canvas elements -->
        <!--[if lt IE 9]>
            <script src="js/excanvas.min.js"></script>
        <![endif]-->
        <script type="text/javascript" src="js/home/jquery.flot.min.js"></script>
        <script type="text/javascript" src="js/home/jquery.flot.pie.min.js"></script>
        <script type="text/javascript" src="js/home/jquery.flot.resize.min.js"></script>
		<script type="text/javascript" src="js/home/imperio.general.js"></script>
        <script type="text/javascript" src="js/home/imperio.charts.js"></script>
    </body>
</html>